<div data-lift="surround?with=hello;at=hello">
  <title data-lift="DocumentSnippet.detailTitle"> - 文档 - Hello, Scala!</title>

  <div class="container">
    <div class="row">
      <div class="col-sm-3 col-md-3 col-lg-3">
        <div data-lift="DocumentSnippet.authorInfo"></div>
        <div data-lift="embed?what=/p/document/_account_documents"></div>
        <div data-lift="embed?what=/p/user/_user_tags"></div>
      </div>

      <div class="col-sm-9 col-md-9 col-lg-9">
        <div class="panel panel-default" data-lift="DocumentSnippet.edit">
          <div class="panel-heading">
            <strong class="panel-title">文档</strong>
          </div>
          <div class="panel-body">
            <form class="form" data-lift="form.ajax">
              <div class="form-group">
                <div class="input-group">
                  <span class="input-group-addon"><strong>标题</strong></span>
                  <input type="text" class="form-control" name="title" placeholder="标题"/>
                </div>
              </div>
              <div class="form-group">
                <div class="input-group">
                  <span class="input-group-addon"><strong>描述</strong></span>
                  <input type="text" class="form-control" name="description" placeholder="文档描述（副标题）"/>
                </div>
              </div>
              <div class="form-group">
                <div class="input-group" title="多个标签使用英文逗号分隔">
                  <span class="input-group-addon"><strong>标签</strong></span>
                  <input type="text" class="form-control" name="tags" placeholder="多个标签使用英文逗号分隔"/>
                </div>
                <span class="help-block"></span>
              </div>
              <div class="form-group" id="control-document-slug">
                <div class="input-group" title="在浏览器地址栏中显示为可读、友好的名字">
                  <span class="input-group-addon"><strong>短名</strong></span>
                  <input type="text" class="form-control" name="slug" placeholder="在浏览器地址栏中显示为可读、友好的名字"/>
                </div>
                <span class="help-block"></span>
              </div>
              <div class="form-group">
                <ul class="nav nav-tabs" id="document-tab">
                  <li class="active">
                    <a href="#document-editor" data-toggle="tab">编辑</a>
                  </li>
                  <li>
                    <a href="#document-preview" data-toggle="tab">预览</a>
                  </li>
                </ul>
                <div class="space-10"></div>
                <div class="tab-content">
                  <div class="tab-pane active" id="document-editor">
                    <textarea class="form-control" rows="20"></textarea>
                  </div>
                  <div class="tab-pane" id="document-preview">
                    <div class="document-preview" style="min-height:360px;"></div>
                  </div>
                </div>
              </div>
              <div class="form-group">
                <button type="submit" id="document-button" class="btn btn-primary">提交</button>
                <input type="hidden" name="submit"/>
              </div>
            </form>
          </div>
        </div>

      </div>
    </div>
  </div>

  <script data-lift="tail" src="/assets/js/hello.document.js" type="text/javascript"></script>
</div>